<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html lang="zh">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>作业报表</title>
    <link rel="stylesheet" href="../css/bootstrap.min.css" />
    <link rel="stylesheet" href="../css/manager/hworkreport.css" />
    <script type="text/javascript" src="../js/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="../js/bootstrap.min.js"></script>
    <script type="text/javascript" src="../js/echarts.simple.min.js"></script>
    <script type="text/javascript" src="../js/manager/common.js"></script>
    <!-- <script type="text/javascript" src="../js/manager/base.js"></script> -->
    <script type="text/javascript" src="../js/common/bootstrap-table.min.js"></script>
    <script type="text/javascript" src="../js/layer.js"></script>
    
    <style>
        .stdbtn { 
	font-weight: bold; padding: 7px 10px; border: 1px solid #ccc; background: #eee url(../images/buttons.png) repeat-x top left; color: #333; 
	-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; cursor: pointer; opacity: 0.8;
}
.stdbtn:hover { text-decoration: none; opacity: 1; }

.btn_yellow { background-position: 0 -38px; border-color: #ebb205; color: #ae510d; }
#main{
	width:100%;
	height:100%;
	min-height: 300px;
}
table {
	table-layout: fixed;
}
td{
    white-space: nowrap;
    overflow:hidden;
    text-overflow: ellipsis;
}
.ctlspan{text-decoration:underline;cursor:pointer;}
    </style>
</head>
<body>
<div class="col-xs-12">
<table cellpadding="0" cellspacing="0" border="0" class="stdtable" id="reportTable" data-toggle="table" data-search="true" data-show-refresh="true" data-show-toggle="true" data-show-columns="true">
<colgroup>
                        <col class="con0" />
                        <col class="con1" />
                        <col class="con0" />
                        <col class="con1" />
                        <col class="con0" />
                        <col class="con1" />
                        <col class="con0" />
                    </colgroup>
                    <thead>
                        <!-- <tr>
                            <th data-field="id" data-width="10%" data-footer-formatter="统计" class="head0">序号</th>
                            <th data-field="content" data-width="25%" data-footer-formatter="" data-formatter="contentFormatter" class="head1">题目概要</th>
                            <th data-field="ktag" data-width="15%" data-footer-formatter="" class="head0">知识点</th>
                            <th data-field="right" data-width="10%" data-footer-formatter="rightfooter" class="head1">正确数</th>
                            <th data-field="wrong" data-width="10%" data-footer-formatter="wrongfooter" class="head0">错误数</th>
                            <th data-field="nodo" data-width="10%" data-footer-formatter="nodofooter" class="head1">未答题数</th>
                            <th data-field="control" data-width="20%" data-footer-formatter="" data-formatter="cotrolFormatter" class="head0">操作</th>
                        </tr> -->
                        <tr>
                            <th data-field="id" data-footer-formatter="统计" class="head0">序号</th>
                            <th data-field="content" data-footer-formatter="" data-formatter="contentFormatter" class="head1">题目概要</th>
                            <th data-field="ktag" data-footer-formatter="" class="head0">知识点</th>
                            <th data-field="right" data-footer-formatter="rightfooter" class="head1">正确数</th>
                            <th data-field="wrong" data-footer-formatter="wrongfooter" class="head0">错误数</th>
                            <th data-field="nodo" data-footer-formatter="nodofooter" class="head1">未答题数</th>
                            <th data-field="control" data-footer-formatter="" data-formatter="cotrolFormatter" class="head0">操作</th>
                        </tr>
                    </thead>
</table>
</div>
<div id="main"></div>
<div id="answerreportdiv" style="display:none;">
	<table cellpadding="0" cellspacing="0" border="0" class="stdtable"
		id="answerTable" data-toggle="table" data-search="true"
		data-show-refresh="true">
		<colgroup>
			<col class="con0" />
			<col class="con1" />
			<col class="con0" />
		</colgroup>
		<thead>
			<tr>
				<th data-field="id" data-footer-formatter="统计" class="head0">学号</th>
				<th data-field="answer" data-footer-formatter="" class="head1">答案</th>
				<th data-field="answernum" data-footer-formatter="" class="head0">作答次数</th>
			</tr>
		</thead>
	</table>
</div>
</body>
</html>
<script type="text/javascript">
	//Common.initTable($('#reportTable'), '/solr/select');
	//$('#reportTable').bootstrapTable({
	//	pagination: true,
	//	pageSize: 15,
	//	pageNumber: 1
	//});
	var option = {
		color : [ '#3398DB' ],
		tooltip : {
			trigger : 'axis',
			axisPointer : { // 坐标轴指示器，坐标轴触发有效
				type : 'shadow' // 默认为直线，可选为：'line' | 'shadow'
			}
		},
		grid : {
			left : '3%',
			right : '4%',
			bottom : '3%',
			containLabel : true
		},
		xAxis : [ {
			type : 'category',
			data : [ 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun' ],
			axisTick : {
				alignWithLabel : true
			}
		} ],
		yAxis : [ {
			type : 'value'
		} ],
		series : [ {
			name : '直接访问',
			type : 'bar',
			barWidth : '60%',
			data : [ 10, 52, 200, 334, 390, 330, 220 ]
		} ]
	};
	//var myChart = echarts.init(document.getElementById('main')).setOption(option);
	function rightfooter(value) {
		var count = 0;
		for ( var i in value) {
			count += value[i].right;
		}
		if (count == 0)
			return '0';
		return count;
	}
	function wrongfooter(value) {
		var count = 0;
		for ( var i in value) {
			count += value[i].wrong;
		}
		if (count == 0)
			return '0';
		return count;
	}
	function nodofooter(value) {
		var count = 0;
		for ( var i in value) {
			count += value[i].nodo;
		}
		if (count == 0)
			return '0';
		return count;
	}
	function GetQueryString(name) {
		var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
		var s = window.location.search.substr(1);
		var r = s.match(reg);
		if (r != null)
			return (r[2]);
		return null;
	}
	var pk = GetQueryString('hwid');
	function question(e) {
		var uid = $(e).parent().parent().attr('data-uniqueid');
		var content = bt.bootstrapTable("getRowByUniqueId", uid);
		layer.alert(content.content + content.question);
	}
	function studetail(e) {
		layer.open({
		  type: 1,
		  skin: 'layui-layer-demo', //样式类名
		  closeBtn: 0, //不显示关闭按钮
		  anim: 2,
		  area: ['60%', '700px'],
		  shadeClose: true, //开启遮罩关闭
		  content: $('#answerreportdiv')
		});
	}
	function cotrolFormatter(value, row, index) {
		return '<span class="ctlspan" onclick="studetail(this);">答题详情</span>';
		//	+'&nbsp;&nbsp;'+'<span class="ctlspan" onclick="tremove(this);">屏蔽</span>';
	}
	function contentFormatter(value, row, index) {
		return '<button class="stdbtn btn_yellow" onclick="question(this);">查看</button>'
				+ value;
	}

	var bt = Common.initTable($('#reportTable'), 'hworkreporttable', {
		pk : pk
	}, {
		pageSize : 10,
		pageNumber : 1,
		singleSelect : true,
		sidePagination : "client"
	});
	$().ready(function() {
		iframeHauto($('#ciframe', window.parent.document));
	});
	function iframeHauto(e) {
		$(e).height($(document).width());
	}
</script>